<template>
  <div class="box">
    <!-- <div class="title">任务管理</div> -->
    <Tabs v-model="tabKey" class="tabs-app" type="card">
      <TabPane label="规则组配置" name="规则组配置">
        <RuleConfig v-if="tabKey == '规则组配置'"> </RuleConfig>
      </TabPane>
      <TabPane label="提醒记录" name="提醒记录">
        <RemindRecord v-if="tabKey == '提醒记录'"> </RemindRecord>
      </TabPane>
      <TabPane label="收件人组" name="收件人组">
        <AddressGroup v-if="tabKey == '收件人组'"></AddressGroup>
      </TabPane>
    </Tabs>
  </div>
</template>

<script>
import RuleConfig from './RuleConfig2.vue'
import RemindRecord from './RemindRecord.vue'
import AddressGroup from './AddressGroup.vue'

export default {
  name: 'remind',
  components: {
    RuleConfig,
    RemindRecord,
    AddressGroup
  },
  data() {
    return {
      tabKey: '规则组配置'
    }
  }
}
</script>

<style lang="less" scoped>
.box {
  display: flex;
  flex-direction: column;
  .tabs-app {
    flex: 1;
    display: flex;
    flex-direction: column;
    /deep/.ivu-tabs-content {
      flex: 1;
    }
  }
}
.title {
  font-size: 18px;
  font-weight: bold;
  padding: 14px;
}
/deep/.single-table-con {
  height: 100%;
  display: flex;
  flex-direction: column;
}
</style>
